<template>
	<view class="post-item-content" >
		<view class='post-item-title' @click="newsLinkTo(itemData)">
			<text>{{itemData.adviceName}}</text>
		</view>

		<view class="post-item-main" @click="newsLinkTo(itemData)">
			<view class="post-item-left-img">
				<image class="img-info" v-if="itemData.adviceImg" :src="itemData.adviceImg" mode="aspectFill"></image>

			</view>

			<view class="post-item-left-info">
				<view class='left1-text'>
					<text>{{itemData.adviceIntro || "暂无内容"}}</text>
				</view>

			</view>
		</view>

		<image @click="clkClose" src="/static/img/ic_close.png" class='btn-close'></image>

	</view>
</template>

<script>
	export default {
		name: "u-ad-item",
		data() {
			return {};
		},
		props: {
			// 背景颜色
			itemData: {
				type: Object,
				default: () => []
			},
		},
		onLoad() {},
		methods: {
			newsLinkTo(item) {
				if (item.urlType === '1') {
					window.open(item.externalUrl)
				}
			},
			clkClose() {
				this.$emit('closeAd');
			},
		},
		computed: {
			// majorArray: function() {
			// 	return this.itemData.majorStr.split(",");
			// }
		}
	}
</script>

<style lang="scss" scoped>

@import "uview-ui/index.scss";
	.btn-close {
		padding: 30rpx;
		width: 30rpx;
		height: 30rpx;
		position: absolute;
		right: 0;
		top: 0;
		z-index: 99;
	}

	.post-item-content {
		position: relative;
		width: 100%;
		text-align: center;
		display: flex;
		align-items: flex-start;
		flex-direction: column;
		border-top: 2rpx solid #bfbfbf;


		.post-item-title {
			font-size: 28rpx;
			font-family: SimHei;
			font-weight: 400;
			line-height: 52rpx;
			color: $econdary-word-color;
			opacity: 1;
			span {
			font-size: 28rpx;
			}
		}

		.post-item-main {
			display: flex;
			flex-flow: row nowrap;
			flex-grow: 10;
			width: 100%;
			padding-top: 20rpx;

			.post-item-left-img {
				display: flex;
				flex-direction: column;
				margin-right: 20rpx;
				align-items: flex-end;

				.img-info {
					width: 231rpx;
					height: 173rpx;
					border-radius: 8rpx;
				}

				.txt-time {
					font-size: 15rpx; //15rpx rem: 规定屏幕宽度为20rem；1rem = (750/20)rpx =37.5rpx;
					font-family: SimHei;
					color: #949494;
					margin-top: 15rpx;
					opacity: 1;
				}
			}

			.post-item-left-info {
				display: flex;
				width: 100%;
				flex-flow: column nowrap;
				flex-grow: 10;

				.left1-text {
					font-family: SimHei;
					font-weight: 400;
					text-align: left;
					align-self: flex-start;
					color: #949494;
					height: 173rpx;
					opacity: 1;
					font-size: 26rpx;
					font-family: Source Han Sans CN;
					font-weight: 400;
					color: #707070;
					line-height: 36rpx;
				}

				.left1-content {
					display: flex;
					align-self: flex-end;

					.left1-content-text {
						border: 2rpx solid #21D2FF;
						opacity: 1;
						border-radius: 8rpx;
						padding: 8rpx 21rpx;

						font-size: 15rpx;
						font-family: SimHei;
						font-weight: 400;
						line-height: 21rpx;
						color: #21D2FF;
						opacity: 1;
						margin-left: 17rpx;
						transform: scale(0.833333);
						-webkit-text-size-adjust: none;
					}
				}
			}
		}

	}
</style>
